﻿@{Layout = null;}
<div class="widgetBar">

    <div class="barInner">

        <ul class="navigation">
            <li class="active"><a href="@Url.Action("Index")"><i class="icon-white icon-th-large"></i> @Parse("Dashboard")</a></li>
            <li>
                <a href="#"><i class="icon-white icon-list"></i> Form elements</a>
                <ul class="subMenu">
                    <li><a href="forms.html"><span>+</span> Form elements</a></li>
                    <li><a href="forms-wizard.html"><span>+</span> Form wizards</a></li>
                    <li><a href="forms-validate.html"><span>+</span> Form validation</a></li>
                    <li><a href="input-grid.html"><span>+</span> Input grid</a></li>
                </ul>
            </li>
            <li><a href="charts.html"><i class="icon-white icon-signal"></i> Charts & Grahps</a></li>
            <li>
                <a href="#"><i class="icon-white icon-th"></i>  Components</a>
                <ul class="subMenu">
                    <li><a href="bootstrap-components.html"><span>+</span> Bootstrap elements</a></li>
                    <li><a href="grid.html"><span>+</span> Bootstrap grid</a></li>
                    <li><a href="gallery.html"><span>+</span> Gallery & thumbnails</a></li>
                </ul>
            </li>
            <li><a href="icons.html"><i class="icon-white icon-leaf"></i> Icons</a></li>
            <li>
                <a href="#"><i class="icon-white icon-heart"></i> UI elements</a>
                <ul class="subMenu">
                    <li><a href="ui-elements.html"><span>+</span> Main UI elements</a></li>
                    <li><a href="buttons.html"><span>+</span> Buttons</a></li>
                    <li><a href="messages.html"><span>+</span> Messages</a></li>
                    <li><a href="player.html"><span>+</span> UI HTML5 Player</a></li>
                </ul>
            </li>
            <li>
                <a href="tables.html"><i class="icon-white icon-tasks"></i> Tables</a>
                <ul class="subMenu">
                    <li><a href="tables.html"><span>+</span> Standard tables</a></li>
                    <li><a href="datatable.html"><span>+</span> Dynamic tables</a></li>
                </ul>
            </li>
            <li>
                <a href="#"><i class="icon-white icon-ban-circle"></i> Error pages</a>
                <ul class="subMenu">
                    <li><a href="403.html"><span>+</span> Error 403</a></li>
                    <li><a href="404.html"><span>+</span> Error 404</a></li>
                    <li><a href="405.html"><span>+</span> Error 405</a></li>
                    <li><a href="500.html"><span>+</span> Error 500</a></li>
                    <li><a href="502.html"><span>+</span> Error 502</a></li>
                    <li><a href="offline.html"><span>+</span> Offline page</a></li>
                </ul>
            </li>
            <li><a href="typography.html"><i class="icon-white icon-align-justify"></i> Typograhpy</a></li>
            <li><a href="calendar.html"><i class="icon-white icon-calendar"></i> Calendar</a></li>
            <li><a href="file-uploader.html"><i class="icon-white icon-folder-close"></i> File manager</a></li>
            <li>
                <a href="#"><i class="icon-white icon-asterisk"></i> Other pages</a>
                <ul class="subMenu">
                    <li><a href="inbox.html"><span>+</span> Inbox</a></li>
                    <li><a href="invoice.html"><span>+</span> Invoice</a></li>
                    <li><a href="login.html"><span>+</span> Login</a></li>
                </ul>
            </li>
        </ul>

        <div class="widgetBarContent">
            <div class="divider"><div><span></span></div></div>
            <div align="center">
                <div class="pieChart">
                    <div class="percentage" data-percent="55"><span>55</span>%</div>
                    <span>New visits</span>
                </div>
                <div class="pieChart">
                    <div class="percentage02" data-percent="32"><span>32</span>%</div>
                    <span>New orders</span>
                </div>
            </div>
        </div>

        <div class="widgetBarContent">
            <div class="divider"><div><span></span></div></div>

            <div class="progressBox">
                <span class="widgetBarTitle">Diskspace usage:</span>
                <div class="green-progress spaceProgress"></div>
                <span class="value vSpace"></span>
            </div>

            <div class="progressBox">
                <span class="widgetBarTitle">File count:</span>
                <div class="red-progress fileProgress"></div>
                <span class="value fSpace"></span>
            </div>

            <div class="progressBox">
                <span class="widgetBarTitle">Bandwidth limit:</span>
                <div class="orange-progress bandwidthProgress"></div>
                <span class="value bSpace"></span>
            </div>

            <div class="divider"><div><span></span></div></div>
        </div>

        <div class="widgetBarContent">
            <span class="widgetBarTitle">Chat windows:</span>
        </div>

        <ul class="chatBar">
            <li>
                <a href="#" class="online">
                    <img class="avatar" src="/content/upload/201311/avatar.jpg" alt="">
                    <span class="name">Adam Smith</span>
                </a>
            </li>
            <li>
                <a href="#" class="offline">
                    <img class="avatar" src="/content/upload/201311/avatar.jpg" alt="">
                    <span class="name">June Marry</span>
                </a>
            </li>
            <li>
                <a href="#" class="online">
                    <img class="avatar" src="/content/upload/201311/avatar.jpg" alt="">
                    <span class="name">Joshua Josh</span>
                </a>
            </li>
            <li>
                <a href="#" class="away">
                    <img class="avatar" src="/content/upload/201311/avatar.jpg" alt="">
                    <span class="name">Mark Johan</span>
                </a>
            </li>
        </ul>

        <div class="widgetBarContent">
            <div class="divider"><div><span></span></div></div>
            <div id="date"></div>
            <div class="divider"><div><span></span></div></div>
        </div>

    </div>

</div>